// console.log(location.search);
window.onload = function () {
    loadGrade()
    // setTimeout(()=>{
    //     loadStudentByNo()
    // },500)
}
// 加载年级信息
function loadGrade() {
    let xhr = new XMLHttpRequest()
    /* 
        https://www.bingjs.com:8001/Grade/GetAll  查询全部年级信息  [GET请求]
    */
    xhr.open("GET", `https://www.bingjs.com:8001/Grade/GetAll`)
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            let str = JSON.parse(xhr.response)
            str.unshift({ GradeId: 0, GradeName: "请选择年级" })
            console.log(str)
            str.forEach(a => {
                let option = document.createElement("option")
                console.log(option);
                option.value = a.GradeId
                option.innerHTML = a.GradeName
                gradeId.appendChild(option)
            })
        }
    }
}
//根据学号加载学生信息的方法
// function loadStudentByNo(){
//     // search有内容，就表示当前页面为修改
//     if(location.search){
//         // 设置标题
//         title.innerHTML = "修改学生"
//         add_btn.innerHTML = "修改"
//         let studentNo = location.search.split("?")[1].split("=")[1]
//         console.log(studentNo);
//         let xhr = new XMLHttpRequest()
//         xhr.open("GET",`https://www.bingjs.com:8001/Student/GetStudentByNo?StudentNo=${studentNo}`)
//         xhr.send()
//         xhr.onreadystatechange = function(){
//             if(xhr.readyState === 4 && xhr.status === 200){
//                 let str = JSON.parse(xhr.response)
//                 console.log(str);
//                 // 给表单元素赋值
//                 $Key("#studentNo").value = str.StudentNo
//                 $Key("#loginPwd").value = str.LoginPwd
//                 $Key("#studentName").value = str.StudentName
//                 if(str.Sex == "M"){
//                     document.getElementsByName('sex')[0].checked = true
//                 }else{
//                     document.getElementsByName('sex')[1].checked = true
//                 }
//                 $Key("#gradeId").value = str.GradeId
//                 $Key("#phone").value = str.Phone
//                 $Key("#address").value = str.Address
//                 $Key("#bornDate").value = str.BornDate
//                 $Key("#email").value = str.Email
//                 $Key("#identityCard").value = str.IdentityCard
//                 $Key("#studentNo").setAttribute("disabled","disabled")
//             }
//         }
//     }
// }


function $Key(getKey) {
    return document.querySelector(getKey)
}
// 添加按钮事件
$Key("#add_btn").onclick = function () {
    // 添加元素 ==> 点击按钮获取表单中的内容
    let studentNo = $Key("#studentNo").value
    let loginPwd = $Key("#loginPwd").value
    let studentName = $Key("#studentName").value
    let sex = [...document.getElementsByName("sex")].find(a => a.checked).value
    let gradeId = $Key("#gradeId").value
    let phone = $Key("#phone").value
    let address = $Key("#address").value
    let bornDate = $Key("#bornDate").value
    let email = $Key("#email").value
    let identityCard = $Key("#identityCard").value
    // json文件 数据格式 [{ }]
    // 将获取的数据放在一个对象中 方便Ajax请求发送
    let obj = {
        studentNo,
        loginPwd,
        studentName,
        sex,
        gradeId,
        phone,
        address,
        bornDate,
        email,
        identityCard
    }
    // 将js转成JSON格式
    let jsons = JSON.stringify(obj)
    // 通过Ajax方式添加数据
    let xhr = new XMLHttpRequest()
    // 定义提交地址
    // let url = "https://www.bingjs.com:8001/Student/Add"
    // if(this.innerHTML == "修改"){
        // 切换提交地址为修改
        // url = "https://www.bingjs.com:8001/Student/Update"
    // }
    // xhr.open("POST", url)
    xhr.open("POST",`https://www.bingjs.com:8001/Student/Add`)
    // 设置请求头
    // xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
    xhr.setRequestHeader("Content-Type", "application/json")
    xhr.send(jsons)
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            let obj = JSON.parse(xhr.response)
            console.log(obj);
            if (obj) {
                alert("操作成功")
            }
        }
    }
}

// 重置按钮点击事件
$Key("#cancel_btn").onclick = function(){
    location.href = '../html/addStudent.html'
}
    // 表单 ==> 正则验证
    function funValue(val, reg, spans) {
        if (reg.test(val)) {
            spans.innerHTML = "输入正确"
            spans.style.color = "green"
        } else if (val === "") {
            spans.innerHTML = "内容不能为空"
            spans.style.color = "red"
        } else {
            spans.innerHTML = "输入错误,请重新输入"
            spans.style.color = "red"
        }
    }
    let stu_no_ts = document.getElementById("stu_no_ts")
    $Key("#studentNo").onfocus = function () {
        stu_no_ts.innerHTML = "学号格式：KW59_xx"
    }
    $Key("#studentNo").onblur = function () {
        let val = this.value
        let reg = /^KW59_\d{2}$/
        // ajax 获取数据传给后端
        let xhr = new XMLHttpRequest()
        /* 
            https://www.bingjs.com:8001/Student/GetStudentByNo  根据学号查询单个学生信息    [GET请求]
            (参数studentNo：学生学号，不可以为空)
        */
        xhr.open("GET", `https://www.bingjs.com:8001/Student/GetStudentByNo?studentNo=${studentNo}`)
        xhr.send()
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                funValue(val, reg, stu_no_ts)
            }
        }
    }
    // 密码正则验证
    let stu_pwd_ts = document.getElementById("stu_pwd_ts")
    $Key("#loginPwd").onfocus = function () {
        stu_pwd_ts.innerHTML = "密码由6~18位数字 字母 下划线组成"
    }
    $Key("#loginPwd").onblur = function () {
        let val = this.value
        let reg = /^\w{6,18}$/
        funValue(val, reg, stu_pwd_ts)
    }
    // 姓名正则验证
    let stu_name_ts = document.getElementById("stu_name_ts")
    $Key("#studentName").onfocus = function () {
        stu_name_ts.innerHTML = "姓名格式：由2~5个汉字组成"
    }
    $Key("#studentName").onblur = function () {
        let val = this.value
        let reg = /^[\u4E00-\u9FA5]{2,5}$/
        funValue(val, reg, stu_name_ts)
    }

    // 年级编号正则验证
    let stu_gradeId_ts = document.getElementById("stu_gradeId_ts")
    $Key("#gradeId").onfocus = function () {
        stu_gradeId_ts.innerHTML = "请下拉选择年级编号"
    }
    $Key("#gradeId").onchange = function () {
        let val = this.value
        // [^]除了某一个不要 其他都要
        // [^0]除了 0 不要 其他都可以选择
        let reg = /^[^0]$/
        funValue(val, reg, stu_gradeId_ts)
    }

    // 电话号码正则验证
    let stu_phone_ts = document.getElementById("stu_phone_ts")
    $Key("#phone").onfocus = function () {
        stu_phone_ts.innerHTML = "手机号格式：11位数字,第一位是1 第二位3-9  第三位以后 随机 9 个数"
    }
    $Key("#phone").onblur = function () {
        let val = this.value
        // [^]除了某一个不要 其他都要
        // [^0]除了 0 不要 其他都可以选择
        let reg = /^1[3-9]\d{9}$/
        funValue(val, reg, stu_phone_ts)
    }
    // 地址验证
    let stu_address_ts = document.getElementById("stu_address_ts")
    $Key("#address").onfocus = function () {
        stu_address_ts.innerHTML = "请输入地址"
    }
    $Key("#address").onblur = function () {
        let val = this.value
        let reg = /^[\u4E00-\u9FA5]{2,100}$/
        funValue(val, reg, stu_address_ts)
    }

    // 生日正则验证
    let stu_bornDate_ts = document.getElementById("stu_bornDate_ts")
    $Key("#bornDate").onfocus = function () {
        stu_bornDate_ts.innerHTML = "生日格式：xxxx-xx-xx"
    }
    $Key("#bornDate").onblur = function () {
        let val = this.value
        // [^]除了某一个不要 其他都要
        // [^0]除了 0 不要 其他都可以选择
        let reg = /^(([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3})-(((0[13578]|1[02])-(0[1-9]|[12][0-9]|3[01]))|((0[469]|11)-(0[1-9]|[12][0-9]|30))|(02-(0[1-9]|[1][0-9]|2[0-8]))))|((([0-9]{2})(0[48]|[2468][048]|[13579][26])|((0[48]|[2468][048]|[3579][26])00))-02-29)$/
        funValue(val, reg, stu_bornDate_ts)
    }

    // 邮箱验证
    let stu_email_ts = document.getElementById("stu_email_ts")
    $Key("#email").onfocus = function () {
        stu_email_ts.innerHTML = "邮箱格式：xxxxxxxxx@xxx.com"
    }
    $Key("#email").onblur = function () {
        let val = this.value
        let reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
        funValue(val, reg, stu_email_ts)
    }

    // 身份证验证
    let stu_id_ts = document.getElementById("stu_id_ts")
    $Key("#identityCard").onfocus = function () {
        stu_id_ts.innerHTML = "身份证格式：18位数字，最后一位校验位可以是数字也可以是X"
    }
    $Key("#identityCard").onblur = function () {
        let val = this.value
        let reg = /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/
        funValue(val, reg, stu_id_ts)
    }

    // // 添加一个学生对象
    // let stu = {}
    // // 获取表单数据，将数据赋值给学生对象
    // stu.studentNo = studentNo.value
    // stu.loginPwd = loginPwd.value
    // stu.studentName = studentName.value
    // let sexes = document.getElementsByName("sex")
    // sexes.forEach(s => {
    //     if (s.checked) {
    //         stu.sex = s.value
    //     }
    // })
    // stu.gradeId = gradeId.value
    // stu.phone = phone.value
    // stu.address = address.value
    // stu.bornDate = bornDate.value
    // stu.email = email.value
    // stu.identityCard = identityCard.value
    // /* 
    //     https://www.bingjs.com:8001/Student/Add  添加学生    [POST请求]
    //         参数：
    //         (
    //         studentNo 学号，
    //         loginPwd 密码，
    //         studentName 姓名，
    //         sex 性别，
    //         gradeId 年级编号，
    //         phone 电话，
    //         address 地址，
    //         bornDate 生日，
    //         email 邮箱，
    //         identityCard 身份证
    //         )
    // */
    // // json文件 数据格式 [{ }]
    // // 将获取的数据放在一个对象中 方便Ajax请求发送
    // let obj = {
    //     studentNo,
    //     loginPwd,
    //     studentName,
    //     sexes,
    //     gradeId,
    //     phone,
    //     address,
    //     bornDate,
    //     email,
    //     identityCard
    // }
    // // 将js转成JSON格式
    // let jsons = JSON.stringify(obj)
    // let xhr = new XMLHttpRequest()
    // xhr.open("POST", `https://www.bingjs.com:8001/Student/Add`)
    // // GET请求方式的参数放在url后面，POST请求方式的参数放在send()方法里
    // // 设置请求头
    // // xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
    // xhr.setRequestHeader("Content-Type", "application/json")
    // xhr.send(jsons)
    // xhr.onreadystatechange = function () {
    //     if (xhr.readyState === 4 && xhr.status === 200) {
    //         let obj = JSON.parse(xhr.response)
    //         console.log(str)
    //         if (obj) {
    //             alert("添加成功")
    //         }
    //     }
    // }

